import React from 'react';
import classNames from 'classnames';

import DialogSign from './DialogSign';
import DialogSignLong from './DialogSignLong';
import DialogUnSign from './DialogUnSign';
import ProductItem from './ProductItem';

import { product as ProductConfig} from '../config/Common';

class Product extends React.Component {

  constructor() {
    super();

    this.state = {
       dialogVisiable : false,
       product : null
    };
  }

  static propTypes = {
      products : React.PropTypes.array.isRequired
  }

  static defaultProps = {
      products : null
  }
  
  handleProductDetail(product, event){
    
    let { productAction } = this.props;

    let param = {
      pid : product.gsid
    };

    //获取策略持仓列表
    productAction.fetchHolding(param);
    //获取策略操作历史
    productAction.fetchHistory(param);

    event.preventDefault();
  }

  handleProductUnSign(product, event){
    this.setState({
      dialogVisiable : true,
      product : product
    });

    event.preventDefault();
  }

  handleProductSign(product, event){
    this.setState({
      dialogVisiable : true,
      product : product
    });

    event.preventDefault();
  }

  handleDialogHide(){
    this.setState({
       dialogVisiable : false
    });
  }

  render() {

    let { products, user, history, productAction, productType, productStatus} = this.props;

    return (
        <div>
           { 
              products && products.map((product, i) =>  
                <ProductItem 
                  product = { product } 
                  key = { product.gsid }
                  user = { user }
                  productAction = { productAction }
                  handleProductDetail={ this.handleProductDetail.bind(this, product) }  
                  handleProductSign= { this.handleProductSign.bind(this, product) }
                  handleProductUnSign= { this.handleProductUnSign.bind(this, product) } />
              )
           }

           { 
              productStatus === ProductConfig.productStatus.hasSign?
              <DialogUnSign 
                product = { this.state.product } 
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
              :
              productType === ProductConfig.productType.long?
              <DialogSignLong 
                product = { this.state.product }
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
              :
              <DialogSign
                product = { this.state.product }
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
           }  

        </div>
    );
  }
}

export default Product;
